<template>
  <div id="app">
    <!-- 路由出口组件 由vue-router提供 -->
    <router-view v-if="!showMicroApp" />
    <!-- 使用无界渲染子应用 -->
    <WujieVue v-else width="100%" height="100%" name="big-screen" :url="url"></WujieVue>
  </div>
</template>

<script>
// 设计一个让子应用加载的规则
// 只有当前路由 === '/big-screen' 时候让子应用开始加载 否则就显示主应用界面
export default {
  name: 'App',
  computed: {
    showMicroApp () {
      // 这是一个条件 是是否加载自应用的判断条件
      // 设计的路由条件 不能在主应用的router中找到
      return this.$route.path === '/big-screen'
    }
  },
  data () {
    return {
      url: "http://localhost:5173/big-screen"  // 子应用地址
    }
  }
}
</script>
